<template>
  <div class="leftClassification">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane v-for="(item,i) of tabsText" :key="i" :label="item.label" :name="item.name" />
    </el-tabs>
    <el-tree :highlight-current="true" :data="data" :props="defaultProps" accordion @node-click="handleNodeClick" />
  </div>
</template>
<script>
export default {
  name: 'LeftClassification',
  props: {
    tabsText: {
      type: [Array, Object],
      default: () => [
        { label: '物品', name: 'goods' },
        { label: '药品', name: 'drugs' },
      ],
    },
    getUrl: {
      type: String,
      default: 'data/goods/treeList',
    },
    isCommonlyUsed: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      tabsVal: '',
      activeName: 'goods',
      data: [],
      defaultProps: {
        children: 'children',
        label: 'dataName',
      },
    };
  },
  mounted() {
    this.tabsVal = this.tabsText[0].label + '类';
    this.activeName = this.tabsText[0].name;
    // this.tabsText[0].label === "套餐" ? this.tabsVal = '项目类' : this.tabsVal = this.tabsText[0].label + '类';
    // this.tabsText[0].name === "meal" ? this.activeName = 'product' : this.activeName = this.tabsText[0].name;
    this.getList(this.getUrl);
  },
  methods: {
    getList(url) {
      let tabVal = this.tabsVal === "套餐类" ? tabVal = '项目类' : tabVal = this.tabsVal;
      this.$api[url]({ dataType: tabVal }).then(res => {
        if (res.code !== 200) return;
        this.data = res.data;
        if (this.isCommonlyUsed) {
          const id = this.tabsVal === "套餐类" ? -1 : this.tabsVal === "项目类" ? -2 : this.tabsVal === "物品类" ? -3 : -4;
          const json = {
            id: id,
            dataName: '常用',
          };
          this.data.unshift(json);
        }
      });
    },
    handleClick(val) {
      this.tabsVal = val.label + '类';
      // val.label === '套餐' ? this.tabsVal = '项目类' : this.tabsVal = val.label + '类';
      // if (val.name === 'meal') {
      // this.url = 'doctor/consulting/getAllComboList';
      // this.url = 'data/goods/treeList';
      // } else {
      // this.url = 'data/goods/treeList';
      // }
      this.getList('data/goods/treeList');
      this.$emit('tabsVales', val.name);
    },
    handleNodeClick(data) {
      const list = this.dataHandle(data);
      const json = {
        dataType: this.tabsVal,
        list: list,
      };
      this.$emit("classificationClist", json);
    },
    dataHandle(item) {
      let list = [];
      list.push(item.id);
      if (item.hasChild) {
        item.children.forEach(json => {
          list = list.concat(this.dataHandle(json));
        });
      }
      return list;
    },
  },
};
</script>
<style scoped>
.leftClassification {
  width: 170px;
  min-height: 100%;
  /* border-right: 2px solid #e9e9e9; */
}
</style>
